﻿<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-020.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-021.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-022.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-023.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[

jQuery(document).ready(function() {
Cufon.replace('#blog-title,.postleft h2,.title h2', { fontFamily: 'Liberation Serif' });

});

//]]>
</script>
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a>
<style type="text/css">
#slidearea{
        height: 250px;
        overflow: hidden;
        position: relative;
        width:670px;
        margin-bottom:10px;
        background:#373737;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        float:left;
        display:inline;
}

#gallerycover{
        overflow: hidden;
        margin:15px ;
        height: 220px;
}

.mygallery{
        overflow: hidden;
        position:relative;

}

.mytext img{
        position:absolute;
        left:0px;
        top:0px;
        width:635px;
        height:220px;

}

.mytext a img {
border:none;
}

.mytext{
        position:relative;
        width:635px;
        height: 220px;
        float:left;
        display:inline;
        float:left;
        color:#c4c4c4;
        background:#4F4B40;
        border:1px solid #CFC4A8;
}

.inpost{
        position:absolute;
        bottom:10px;
        left:10px;
        width:620px;
        background:url(http://2.bp.blogspot.com/_4HKUHirY_2U/S7vsC69pSuI/AAAAAAAAA5k/4HH41BzX3lo/trans.png);
}

.inpost p{
        margin:5px;
        font-size:12px;
        font-family:"Segoe UI";,Calibri,"Myriad Pro",Myriad,"Trebuchet MS";,Helvetica,Arial,sans-serif;
}

.mytext h2 {
        padding:5px 10px;
        color:#fff;
        font-size: 16px ;

}

.mytext h2 a:link,.mytext h2 a:visited{
        color:#e9dbd5;
}
</style>





<h3>» How To Add Featured Auto Content Slider to Blogger</h3>








<script type="text/javascript">
var $jx = jQuery.noConflict();
$jx(function() {
 $jx(".mygallery").jCarouselLite({
 btnNext: ".nextb",
        btnPrev: ".prevb",
                visible: 1,
            speed: 1500,
                auto:5000,
                mouseWheel: true,
                easing: "backout"

    });

});
</script>

<div id="slidearea">
<div id="gallerycover">
<div class="mygallery">

<ul>

<!-- Slide-1 Code Start -->
<li>
<div class="mytext">
<a href="http://24work.blogspot.com/2012/01/how-to-change-mouse-cursor-in-blogger.html" target="_blank"><img alt="How to change mouse cursor in blogger blog to animated cursors" width="512" src="http://2.bp.blogspot.com/-Y9C1kavbpBQ/UhsGgU4g8vI/AAAAAAAABJk/SyI40OvYfo4/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="176"/></a>
<div class="inpost">
<p> How to change mouse cursor in blogger blog to animated cursors.One of the best way to add extra fun to your ....<a href="#">read more</a> [...] </p>
</div>
</div>
</li>
<!-- Slide-1 Code End -->


<!-- Slide-2 Code Start -->
<li>
<div class="mytext">
<a href="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" target="_blank"><img alt="Numbered Page Navigation For Blogger New Script" width="512" src="http://4.bp.blogspot.com/-7VVQZWZSIyY/UhsJRPL2X4I/AAAAAAAABJ4/F2q5GIjrRzA/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="176"/></a>
<div class="inpost">
<p>Today we will see how to add a nice page number navigation hack blogger. The default navigation links (i.e Older Posts) is not the friendly visitor [...] </p>
</div>
</div>
</li>
<!-- Slide-2 Code End -->


<!-- Slide-3 Code Start -->
<li>
<div class="mytext">
<a href="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" target="_blank"><img alt="How To Add Snow Effect On The Blogger Mouse Cursor Area" width="512" src="http://4.bp.blogspot.com/-gIUZJEYkJz0/UhtVPXnTPpI/AAAAAAAABKQ/lxfB6wI6GJQ/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="176"/></a>
<div class="inpost">
<p>How to change mouse cursor in blogger blog to animated cursors.One of the best way to add extra fun to your blog is, changing mouse cursor on your blog [...] </p>
</div>
</div>
</li>
<!-- Slide-3 Code End -->


<!-- Slide-4 Code Start -->
<li>
<div class="mytext">
<a href="http://24work.blogspot.com/2012/01/falling-objects-falling-text-marquee.html" target="_blank"><img alt="Falling Objects / Falling Text / Marquee Scrolling Text Generator for Blogger" width="512" src="http://4.bp.blogspot.com/-uPng9qokTSQ/UhtXcrC3koI/AAAAAAAABKc/LuwA-MwlqvI/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="176"/></a>
<div class="inpost">
<p>You can show the falling objects or graphics to your Blogger profile page. This generator falling objects to specify an image of your choice [...] </p>
</div>
</div>
</li>
<!-- Slide-4 Code End -->


<!-- Slide-5 Code Start -->
<li>
<div class="mytext">
<a href="http://24work.blogspot.com/2011/12/how-to-add-animated-flash-clock-to-your.html" target="_blank"><img alt="How To Add Animated Flash Clock To Your Blogger Blog" width="512" src="http://4.bp.blogspot.com/-yGyAb5QH36Q/UhtamdVBndI/AAAAAAAABKw/Wath3NPYpyQ/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="176"/></a>
<div class="inpost">
<p>Hello! `How are you guys? here's the cool Clock.this tutorial will show you how to Add animated flash clock gadget your Blogger blog [...] </p>
</div>
</div>
</li>
<!-- Slide-5 Code End -->



</ul>

<div class="clear"></div>

</div>
</div>
</div>
<div class="clear"></div>

